Solusi Error "Unable to resolve module" pada React Native: Penyebab dan Cara Mengatasinya
Saat kita sedang mengerjakan aplikasi dengan React Native, cukup sering kita menemui error yang bertuliskan:Unable to resolve module (nama_modul) from (path file)
Error ini muncul ketika React Native tidak dapat menemukan atau memuat modul yang dibutuhkan. Modul tersebut bisa berupa library pihak ketiga seperti (react-navigation, axios, react-native-vector-icons), maupun file lokal di dalam proyek. Akibatnya, aplikasi tidak bisa dijalankan baik di emulator maupun perangkat fisik.
Penyebab Error
Masalah ini biasanya terjadi karena beberapa hal berikut:
1. Cache Metro bundler yang masih menyimpan data lama
React Native menggunakan Metro bundler untuk mengompilasi kode, dan cache yang belum diperbarui bisa menyebabkan modul seolah-olah hilang.
2. Node modules hilang atau tidak terpasang dengan benar
Jika folder node_modules tidak lengkap atau rusak, modul yang dipanggil tidak dapat ditemukan.
3. Kesalahan penulisan import atau path file
Misalnya salah menulis huruf besar/kecil pada nama file (Home.js dengan home.js) karena React Native peka terhadap huruf kapital.
4. Library belum di-link atau instalasi tidak selesai
Untuk beberapa modul native, terutama versi lama, perlu proses linking agar dapat berjalan.
Cara Mengatasi Error Ini
1. Hapus Cache Metro Bundler
Langkah pertama adalah membersihkan cache agar React Native membaca ulang semua modul. Jalankan perintah berikut di terminal:
npx react-native start --reset-cache
Atau bisa juga:
npm start -- --reset-cache
2. Hapus dan Install Ulang Node Modules
Apabila masih error, coba hapus folder node_modules dan file lock (package-lock.json atau yarn.lock), lalu install ulang semua dependensi:
rm -rf node_modules
rm package-lock.json
npm install
Atau jika menggunakan yarn:
rm -rf node_modules
rm yarn.lock
yarn install
3. Periksa Import dan Path File
Pastikan nama file dan path importnya sesuai. Contoh:
// Salah (huruf besar/kecil tidak sesuai)
import Home from './screen /home';
// Benar (sesuai nama file Home.js)
import Home from './screen/Home';
4. Rebuild Aplikasi
Jika modul yang digunakan memiliki native dependency, lakukan rebuild agar modul tersambung ke proyek Android/iOS:
npx react-native run-android
npx react-native run-ios